import React from 'react'
import {WeaColorPicker,
    WeaTools,
    WeaDialog,
    WeaSearchGroup,
    WeaFormItem,
    WeaInput,
    WeaSelect,
    WeaHelpfulTip,
    WeaLocaleProvider,
    WeaInputNumber,
    WeaError,
    WeaCheckbox
} from 'ecCom'

import {Button,Icon} from 'antd'
import {WeaMaterialLib} from 'weaPortalPublic';

const getLabel = WeaLocaleProvider.getLabel;
class Content extends React.Component{

    render(){
        let diplay ="none";
        if(this.props.data.viewType=="1")
        { diplay = "";}
        return <WeaSearchGroup showGroup={true}>

            <WeaFormItem label={getLabel(229,"标题")} labelCol={{span: 6}} wrapperCol={{span: 16}}>
                   <WeaError  ref='weaError'
                              error={getLabel(388025,"标题不能为空")}>
                    <WeaInput  style={{width:313}} value={this.props.data.title} viewAttr={3} onChange={(value)=>{this.props.titleChange(value);
                        if(value === '') this.refs.weaError.showError();
                    }}/>
                   </WeaError>
            </WeaFormItem>

            {/*<WeaFormItem label="流程类型" labelCol={{span: 6}} wrapperCol={{span: 16}}>*/}
              {/*<div style={{width: '100%'}}>*/}
                   {/*<WeaSelect*/}
                    {/*options={this.props.data.options}*/}
                    {/*viewAttr="3"*/}
                    {/*value={this.props.data.viewType}*/}
                    {/*onChange={value => this.props.changeViewType(value)}*/}
                    {/*/>*/}
              {/*</div>*/}
            {/*</WeaFormItem>*/}

            <WeaFormItem label={getLabel(19493,"显示条数")}  labelCol={{span: 6}} wrapperCol={{span: 16}}>
                <WeaInputNumber
                    value = {this.props.data.showNum}
                    onChange = {(value)=> this.props.ShowNumChnage(value)}
                />
            </WeaFormItem>

            <WeaFormItem label={getLabel(2077,"背景颜色")} labelCol={{span: 6}} wrapperCol={{span: 18}} >
                <div style={{display:'inline-block',width:'70px'}}>
                    <WeaColorPicker value={this.props.data.bgColor}
                      onChange = {(value) => this.props.changebgColor(value)}
                    />
                </div>
            </WeaFormItem>
            <WeaFormItem label="背景透明度" labelCol={{span: 6}} wrapperCol={{span: 18}} >
                <div style={{display:'inline-block',width:'70px'}}>
                    <WeaInputNumber value={this.props.data.bgTmd}
                                    onChange = {(value) => this.props.changeBgTmd(value)}
                    />
                </div>
            </WeaFormItem>
            <WeaFormItem label={getLabel(82641,"显示未读数")}  style={{"display":diplay}} labelCol={{span: 6}} wrapperCol={{span: 18}} >
                <div style={{display:'inline-block',width:'70px'}}>
                    <WeaCheckbox
                        value={this.props.data.isCount}
                        display="switch"
                        id='test'
                        onChange = {(value) => this.props.changeCount(value)}
                    />
                </div>
            </WeaFormItem>

            <WeaFormItem label={getLabel(387941,"选择图标")}  labelCol={{span: 6}} wrapperCol={{span: 18}}>
                {
                    this.props.data.icon ? (
                        <div className="e9desktop-menu-add-img-edit">
                            <WeaMaterialLib
                                multiCheck={false} onChange={(value)=>{ this.props.changeIcon(value)}} type='button'
                            >
                                <img src={ this.props.data.icon} alt="" className="e9desktop-menu-add-img-edit-img" title={getLabel(387150,"更换图标")}/>
                            </WeaMaterialLib>
                            <div className="e9desktop-menu-add-img-edit-del" title={getLabel(82746,"删除图标")}>
                                <Icon type="cross" onClick={() =>  this.props.changeIcon("") }/>
                            </div>
                        </div>
                    ) : (
                        <div className="e9desktop-menu-add-img-add">
                            <WeaMaterialLib multiCheck={false} onChange={(value)=>{ this.props.changeIcon(value)}} type='button' >

                                <div className="e9desktop-menu-add-img-add-icon" title= {getLabel(387151,"添加图标")}>
                                    <Icon type="plus"/>
                                </div>
                            </WeaMaterialLib>
                        </div>
                    )
                }
            </WeaFormItem>
        </WeaSearchGroup>
    }
}

export default Content;